<!doctype html>
<html lang="en">
  <head>
    <script type="module" crossorigin src="/frontend-mini-challenges/javascript/assets/index-aSJWXjL0.js"></script>
    <link rel="modulepreload" crossorigin href="/frontend-mini-challenges/javascript/assets/navbar-PAFhV-cJ.js">
    <link rel="modulepreload" crossorigin href="/frontend-mini-challenges/javascript/assets/header-DIqzw3PH.js">
    <link rel="stylesheet" crossorigin href="/frontend-mini-challenges/javascript/assets/navbar-Dkne97UN.css">
    <link rel="stylesheet" crossorigin href="/frontend-mini-challenges/javascript/assets/header-DAZPOirm.css">
    <link rel="stylesheet" crossorigin href="/frontend-mini-challenges/javascript/assets/index-3r3EEQfe.css">
  </head>
  <body>
    <div class="container text-center">
      <div class="form">
        <label for="pages">
          Page count
          <input id="pages" type="range" value="6" min="6" max="100" />
        </label>
        <label for="siblings">
          Siblings
          <input id="siblings" type="range" value="1" min="1" max="5" />
        </label>
        <label for="boundary">
          Boundary
          <input id="boundary" type="range" value="1" min="1" max="10" />
        </label>
      </div>

      <nav id="pagination" class="pagination"></nav>
    </div>
  </body>
</html>
